<template>
    <div class="contact__form">
        <h3>Ready To Get Started?</h3>
        <p>You email address will not be published. Required fields are marked.</p>
        <!-- account form -->
        <form action="#" class="account__form">
            <div class="row g-4">
                <div class="col-lg-12">
                    <div class="input-group">
                        <input type="text" class="form-control" id="account-name" placeholder="Jhon Doe" required>
                        <div class="valid-tooltip">
                            Looks good!
                        </div>
                        <div class="invalid-tooltip">
                            Please enter a full name
                        </div>
                    </div>
                </div>
                <div class="col-lg-12">
                    <div class="input-group">
                        <input type="email" class="form-control" id="account-email" placeholder="Email" required>
                        <div class="valid-tooltip">
                            This email is valid
                        </div>
                        <div class="invalid-tooltip">
                            Please enter a valid email
                        </div>
                    </div>
                </div>
                <div class="col-lg-12">
                    <div class="input-group">
                        <input type="number" class="form-control" id="account-mobile" placeholder="Enter number" required>
                        <div class="valid-tooltip">
                            This mobile is valid
                        </div>
                        <div class="invalid-tooltip">
                            Please enter a valid number
                        </div>
                    </div>
                </div>

                <div class="col-lg-12">
                    <div class="input-group">
                        <textarea id="account-desc" class="form-control" rows="4" placeholder="Write a message..."
                            cols="50"></textarea>
                    </div>
                </div>
            </div>

            <div class="account__form-passcheck">
                <div class="form-check">
                    <input type="checkbox" class="form-check-input" value="" id="terms-check">
                    <label for="terms-check" class="form-check-label">Accept <a href="#"> terms
                        </a> and <a href="#"> privacy
                            policy</a>.
                    </label>
                </div>
            </div>

            <button type="submit" class="trk-btn trk-btn--rounded trk-btn--secondary1">Send
                Message</button>
        </form>
    </div>
</template>